<template>
    <div ref="wrapper">
        <slot></slot>
    </div>
</template>
<script>
    import Bscroll from 'better-scroll'
export default {
    name:'scroll',
    props:{
        probeType:{
            type:Number,
            default:1,
        },
        click:{
            type:Boolean,
            default:true
        },
        data:{
            type:Array,
            default:null
        },
        listenScroll:{
            type:Boolean,
            default:false
        }
    },
    mounted(){
        setTimeout(()=>{
            this._initScroll();
        },20)
    },
    methods:{
        _initScroll(){
            if(!this.$refs.wrapper){
                return;
            }
            this.scroll=new Bscroll(this.$refs.wrapper,{
                probeType:this.probeType,
                click:this.click
            })
            if(this.listenScroll){
                let me =this;
                this.scroll.on('scroll',(pos)=>{
                    me.$emit('scroll',pos)
                })
            }
        },
        enable(){
            this.scroll&&this.scroll.enable();
        },
        disable(){
            this.scroll&&this.scroll.disable();
        },
        refresh(){
            this.scroll&&this.scroll.refresh();
        },
        scrollTo(){
            this.scroll&&this.scroll.scrollTo.apply(this.scroll,arguments)
        },
        scrollToElement(){
            this.scroll&&this.scroll.scrollToElement.apply(this.scroll,arguments)
        }
    },
    watch:{
        data(){
            setTimeout(()=>{
                this.refresh();
            },20)
        }
    }
}
</script>
<style scoped lang="less">

</style>


